<template>
  <el-dialog

    title="补货详情"
    :visible="channelShow"
    @close="closeFn"
    @open="openFn"
  >
    <el-table
      :data="list"
      height="350px"
      :header-cell-style="{
        background: '#f4f6fa',
        color: '#666666',
        height: '44px',
      }"
    >
      <el-table-column
        property="channelCode"
        label="活到编号"
      ></el-table-column>
      <el-table-column
        property="sku.brandName"
        label="商品名称"
      ></el-table-column>
      <el-table-column
        property="currentCapacity"
        label="当前数量"
      ></el-table-column>
      <el-table-column
        property="maxCapacity"
        label="还可添加"
      ></el-table-column>
      <el-table-column label="补满数量" width="200px">
        <template v-slot="{ row }">
          <el-input-number
            v-model="row.maxCapacity"
            controls-position="right"
            @change="handleChange"
            :min="1"
            :max="row.maxCapacity"
          ></el-input-number>
        </template>
      </el-table-column>
    </el-table>
    <!-- <div style="padding-top: 10px"  >
      <el-button @click="cancelFn" class="cancal">取 消</el-button>
      <el-button type="primary" class="comfig" @click="comfigFn"
        >确 定</el-button
      >
    </div> -->
  </el-dialog>
</template>

<script>
export default {
  props: {
    channelShow: Boolean,
    list: {
      type: Array,
      default: () => []
    }
  },
  data () {
    return {
      formLabelWidth: '120px'
      //   num: 0
    }
  },
  methods: {
    closeFn () {
      this.$emit('update:channelShow', false)
    },
    handleChange () {
      //   console.log(val)
    },
    openFn () {
      console.log(this.list)
    },
    comfigFn () {
      console.log(this.list)
      this.closeFn()
    },
    cancelFn () {}
  }
}
</script>

<style lang="less" scoped>

/deep/.el-dialog {
    height: 500px;
}
</style>
